﻿@using SelfManagement.Web.Models.ViewModels.ArticleModels;
@model ArticlePagedListViewModel
@{ }

@section Styles{
    <style type="text/css">
    </style>
}

@section Scripts{
    <script type="text/javascript">
        $(function () {
            $('#articleList').nestable({
                maxDepth: 1
            }).on('change', function (e) {
                $('#saveCate').fadeIn(300);
            });

            window.getConfirmAttachData = function () {
                return { "orderInfo": JSON.stringify($("#articleList").nestable('serialize')) };
            }
        })
    </script>
}

@helper OrderedList(List<ArticleCategory> categories)
{
    <ol class="dd-list">
        @{
            var defaultCategory = categories.Where(c => c.IsDefault).FirstOrDefault();
        }
        @foreach (var category in categories.OrderBy(p => p.Order).ThenByDescending(p => p.CreatedTime))
        {
            <li class="dd-item dd3-item" data-id="@category.Id">
                <div class="dd-handle dd3-handle">
                </div>
                <div class="dd3-content">
                    <a href="@Url.Action("Index", "Article", new { Category_Id = category.Id })">
                        @(category.CategoryName)
                    </a>
                    @if (category.IsDefault)
                    {
                        <span class="badge badge-warning">
                            默认分类
                        </span>
                    }
                    &nbsp;&nbsp;&nbsp;
                    @if (!category.IsDefault)
                    {
                        <a data-confirm-text="删除该分类，该分类下的文章将会转移到默认分类【@(defaultCategory.CategoryName)】下，确定删除吗？" data-confirm-button="确定" data-cancel-button="取消"
                           data-confirmed-url="@Url.Action("DeleteCategory", "Article", new { id = category.Id })"
                           class="btn btn-danger btn-xs js-table-ajax-confirm-button pull-right ">
                            <i class="fa fa-trash-o"></i>删除
                        </a>
                    }
                    <a href="@Url.Action("CreateOrEditCategory", "Article",new { id = category.Id })" class="pull-right btn btn-info btn-xs margin-right-10"><i class="fa fa-edit"></i>编辑</a>
                </div>
            </li>
        }
    </ol>
}
<div class="row">
    <div class="col-md-3">
        <div class="portlet">
            <div class="portlet-title">
                <div class="caption">
                    <i class="fa fa-reorder"></i>文章分类
                </div>

                <div class="actions">
                    <a href="@Url.Action("CreateOrEditCategory")" name="options" class="toggle btn btn-success btn-sm active"><i class="fa fa-plus"></i>新增分类</a>
                </div>
            </div>
            <div class="portlet-body">
                <div class="table-toolbar">
                    <a data-confirmed-url="@Url.Action("SaveCategoriesOrder")"
                       data-confirm-text="确定要保存顺序吗？" data-confirm-button="确定" data-cancel-button="取消"
                       class="btn btn-primary js-table-ajax-confirm-button" style="display:none;" id="saveCate">
                        保存顺序调整<i class="fa fa-save"></i>
                    </a>
                </div>
                <div class="dd" id="articleList">
                    @OrderedList(Model.Categories)
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-9">

        <div class="portlet box light-grey">
            <div class="portlet-title">
                <div class="caption">
                    <i class="fa fa-reorder"></i><a href="@Url.Action("Index")">@ViewBag.Title</a> - <span class="bold text-primary">@(Model.Category?.CategoryName ?? "所有文章")</span>
                </div>
                <div class="actions">
                    <a href="@Url.Action("CreateOrEdit")" name="options" class="toggle btn btn-success btn-sm active"><i class="fa fa-plus"></i>新增文章</a>
                </div>
            </div>
            <div class="portlet-body">

                <div class="navbar navbar-default" role="navigation">
                    <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                            <span class="sr-only">
                                导航
                            </span>
                            <span class="fa fa-bar">
                            </span>
                            <span class="fa fa-bar">
                            </span>
                            <span class="fa fa-bar">
                            </span>
                        </button>
                        <span class="navbar-brand">搜索</span>
                    </div>
                    <!-- Collect the nav links, forms, and other content for toggling -->
                    <div class="collapse navbar-collapse navbar-ex1-collapse">

                        <form class="navbar-form navbar-left" role="search">
                            <div class="form-group">
                                @Html.HiddenFor(m => m.Category_Id)
                                @Html.TextBoxFor(m => m.Keyword, new { @class = "form-control", placeholder = "搜索文章" })
                            </div>
                            <button type="submit" class="btn btn-info fa fa-search"></button>
                        </form>

                    </div>
                    <!-- /.navbar-collapse -->
                </div>
                <div class="dataTables_wrapper form-inline">
                    <div class="table-scrollable">
                        <table class="table table-striped table-bordered table-hover">
                            <thead>
                                <tr>
                                    <th>
                                        操作
                                    </th>
                                    <th>
                                        标题
                                    </th>
                                    <th>
                                        发表时间
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var item in Model.PagedList)
                                {
                                    <tr>
                                        <td>
                                            <a href="@Url.Action("CreateOrEdit","Article",new { id = item.Id })" class="btn btn-info btn-xs"><i class="fa fa-edit"></i>编辑</a>
                                            <a data-confirm-text="确定要删除吗？" data-confirm-button="确定" data-cancel-button="取消"
                                               data-confirmed-url="@Url.Action("Delete", "Article", new { id = item.Id })"
                                               class="btn btn-danger btn-xs js-table-ajax-confirm-button">
                                                <i class="fa fa-trash-o"></i>删除
                                            </a>
                                        </td>
                                        <td>
                                            <a href="@Url.Action("Detail", "Article", new { id = item.Id })">@item.Title</a>
                                            @if (item.IsTop)
                                            {
                                                <span class="btn btn-danger btn-xs margin-left-10">置顶</span>
                                            }
                                        </td>
                                        <td>
                                            @item.CreatedTime.ToLocalYYYYMMDDHHmmss()
                                        </td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                    </div>
                    @Html.Partial("_Pagination", Model.PagedList, Model.QueryParameter)
                </div>
            </div>
        </div>
    </div>
</div>

